<template>
	<view class="case" :style="{minHeight: wHeight + 'px' }">
		<view class="case-top" v-for="(item,index) in business">
			<view class="case-name">
				<view class="case-name-text">
					<text>{{item.name}}</text>
				</view>
				<view class="case-fil">
					<text>案例类型</text>
				</view>
				<view class="case-text">
					<text>{{item.time}}</text>
				</view>
			</view>
			<view class="case-yw">
				<text>{{item.presentation}}</text>
			</view>
			<view class="case-fiy">
				<view class="case-fiy-li">
					<text>律师团队: {{item.names}}</text>
				</view>
			</view>
		</view>
	</view> 

</template>

<script>
	export default {
		data() {
			return {
				wHeight: '',
				business: [{
						names: "律师名1",
						name: "案例名称",
						time: "2021-07-26",
						presentation: "案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍",
					},
					{
						names: "律师名2",
						name: "案例名称",
						time: "2021-07-26",
						presentation: "案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍...",
					},
					{
						names: "律师名3",
						name: "案例名称",
						time: "2021-07-26",
						presentation: "案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍案例介绍...",
					},
				],
			}
		},
		onLoad() {
			this.wHeight = this.$store.state.ContentHeight - 45;
		},
	}
</script>

<style lang="less" scoped>
	.case {
		background: #EFEFEF;
		position: absolute;

		.case-top {
			margin-top: 30rpx;
			padding: 30rpx 0;
			background: #FFFFFF;
			width: 750rpx;

			.case-name {
				width: 700rpx;
				margin: 30rpx auto;
				display: flex;
				justify-content: space-between;
				align-items: center;

				.case-name-text {
					text {
						font-size: 35rpx;
						font-family: Source Han Sans CN;
						font-weight: bold;
						color: #333333;
					}
				}

				.case-fil {
					margin-right: 200rpx;
					background: #EDEDED;
					width: 133rpx;
					height: 30rpx;
					border-radius: 0rpx;
					text-align: center;
					line-height: 30rpx;

					text {
						font-size: 23rpx;
						font-family: Source Han Sans CN;
						font-weight: 400;
						color: #666666;
					}
				}

				.case-text {
					float: right;
					margin-right: 30rpx;

					text {
						font-size: 27rpx;
						font-family: Source Han Sans CN;
						font-weight: 400;
						color: #666666;
					}
				}
			}

			.case-yw {
				margin-left: 25rpx;
				width: 600rpx;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;

				text {
					font-size: 27rx;
					font-family: Source Han Sans CN;
					font-weight: 400;
					color: #666666;
				}
			}

			.case-fiy {
				width: 730rpx;
				margin: 20rpx auto;
				display: flex;

				.case-fiy-li {
					margin: 10rpx 15rpx;
					height: 30rpx;
					border-radius: 15rpx;
					text-align: center;
					line-height: 30rpx;

					text {
						font-size: 28rpx;
						font-family: Source Han Sans CN;
						font-weight: 400;
						color: #333333;
					}
				}
			}
		}
	}
</style>
